<?xml version="1.0" encoding="UTF-8"?>

<!--
    Document   : allProducts.xsl
    Created on : March 26, 2013, 10:34 AM
    Author     : DungtTT60215
    Description:
        Purpose of transformation follows.
-->

<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"
                >
    <xsl:output method="html"/>
    <xsl:template match="products">
        <div id="content-left">
            <xsl:apply-templates/>
        </div><!--End content-left-->
    </xsl:template>
    <xsl:template match="product">
        <div class="box-product">

            <img class="img-pro" draggable="true">
                <xsl:attribute name="onmouseover">
                    <xsl:value-of select="'productMouserOverCart('"/>
                    <xsl:value-of select="productID"/>
                    <xsl:value-of select="')'"/>
                </xsl:attribute>
                <xsl:attribute name="onmouseout">
                    <xsl:value-of select="'productMouseOut()'"/>
                </xsl:attribute>
                <xsl:attribute name="src">
                    <xsl:value-of select="productImage"/>
                </xsl:attribute>
                <xsl:attribute name="ondragstart">
                    <xsl:text>drag(event,</xsl:text>
                    <xsl:value-of select="productID"/>
                    <xsl:text>,'</xsl:text>
                    <xsl:value-of select="productName"/>
                    <xsl:text>',</xsl:text>
                    <xsl:value-of select="productPrice"/>
                    <xsl:text>,1,'</xsl:text>
                    <xsl:value-of select="productImage"/>
                    <xsl:text>');</xsl:text>
                </xsl:attribute>
<!--                <xsl:attribute name="onclick">
                    <xsl:text>addToCart(</xsl:text>
                    <xsl:value-of select="productID"/>
                    <xsl:text>,'</xsl:text>
                    <xsl:value-of select="productName"/>
                    <xsl:text>',</xsl:text>
                    <xsl:value-of select="productPrice"/>
                    <xsl:text>,1,'</xsl:text>
                    <xsl:value-of select="productImage"/>
                    <xsl:text>')</xsl:text>
                </xsl:attribute>-->
            </img>
            <span class="name-product" style="width: 200px">
                <xsl:value-of select="productName"/>
            </span>
            <div class="clear"></div>
            <span class="price-product">
                <xsl:value-of select="productPrice"/> $
            </span>
            <div class="clear"></div>
<!--            <a class="btn-addtocart">Add to cart

            </a>-->
            <div class="btnAddtocart">
                <xsl:element name="input">
                    <xsl:attribute name="value">
                        <xsl:text>Add to Cart</xsl:text>
                    </xsl:attribute>
                    <xsl:attribute name="type">
                        <xsl:text>button</xsl:text>
                    </xsl:attribute>
                    <xsl:attribute name="onclick">
                        <xsl:text>addToCart(</xsl:text>
                        <xsl:value-of select="productID"/>
                        <xsl:text>,'</xsl:text>
                        <xsl:value-of select="productName"/>
                        <xsl:text>',</xsl:text>
                        <xsl:value-of select="productPrice"/>
                        <xsl:text>,1,'</xsl:text>
                        <xsl:value-of select="productImage"/>
                        <xsl:text>')</xsl:text>
                    </xsl:attribute>
                    <xsl:attribute name="class">
                        <xsl:text>buttonAddToCart</xsl:text>
                    </xsl:attribute>
                </xsl:element>
            </div>
            <!--End of add to cart-->
            <div  class="clear"></div>
            <!--begin of detail-->
            <div  style="display:none;">
                <xsl:attribute name="id">
                    <xsl:value-of select="'productId'"/>
                    <xsl:value-of select="productID"/>

                </xsl:attribute>

                <div id="header-productDetail" >
                    <img>
                        <xsl:attribute name="src">
                            <xsl:value-of select="productImage"/>
                        </xsl:attribute>
                    </img>
                    <div id="header-product" >
                        <center>
                            <div id="productName-product">
                                <xsl:value-of select="productName"/>
                            </div>
                            <div class="clear"></div>
                            <div id="productPrice-product">
                                <xsl:value-of select="productPrice"/>
                                <xsl:text> $</xsl:text>
                            </div>
                        </center>
                    </div>
                    <ul id="body-productDetail">
                        <li id="monitor-product">
                            <xsl:text>Monitor:</xsl:text>
                            <span>
                                <xsl:value-of select="monitor"/>
                            </span>
                        </li>
                        <li id="cpu-product">
                            <xsl:text> CPU:</xsl:text>
                            <span>
                                <xsl:value-of select="cpu"/>
                            </span>
                        </li>
                        <li id="ram-product">
                            <xsl:text>RAM: </xsl:text>
                            <span>
                                <xsl:value-of select="ram"/>
                            </span>
                        </li>
                        <li id="memory-product">
                            <xsl:text> Memory:</xsl:text>
                            <span>
                                <xsl:value-of select="memory"/>
                            </span>
                        </li>
                        <li id="wifi-product">
                            <xsl:text>WIFI: </xsl:text>
                            <span>
                                <xsl:value-of select="wifi"/>
                            </span>
                        </li>
                        <li id="pin-product">
                            <xsl:text> PIN:</xsl:text>
                            <span>
                                <xsl:value-of select="pin"/>
                            </span>
                        </li>
                        <li id="others-product">
                            <xsl:text>Other: </xsl:text>
                            <span>
                                <xsl:value-of select="others"/>
                            </span>
                        </li>
                    </ul>
                </div>
                <div id="longInfo-product">
                    <div id="shortDecs-product">
                        <xsl:text>Short Information:</xsl:text>
                        <span>
                            <xsl:value-of select="shortDecs"/>
                        </span>
                    </div>
                    <div id="longDecs-product">
                        <xsl:text> Long information: </xsl:text>
                        <span>
                            <xsl:value-of select="longDecs"/>
                        </span>
                    </div>

                </div>

            </div>
            <!--end of detail-->
        </div><!--End box-product-->
    </xsl:template>
</xsl:stylesheet>

<!--<?xml version="1.0" encoding="UTF-8"?>


    Document   : product.xsl
    Created on : August 25, 2012, 9:31 AM
    Author     : ThanhTai
    Description:
        Purpose of transformation follows.


<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"
                >
    <xsl:output method="html"/>
    <xsl:template match="products">
        <div id="content-left">
            <xsl:apply-templates/>
        </div>End content-left
    </xsl:template>
    <xsl:template match="product">
        <div class="box-product" >
            <img class="img-pro" draggable="true">
                <xsl:attribute name="src">
                    <xsl:value-of select="productImage"/>
                </xsl:attribute>
                <xsl:attribute name="ondragstart">
                    <xsl:text>drag(event,</xsl:text>
                    <xsl:value-of select="productID"/>
                    <xsl:text>,'</xsl:text>
                    <xsl:value-of select="productName"/>
                    <xsl:text>',</xsl:text>
                    <xsl:value-of select="productPrice"/>
                    <xsl:text>,1,'</xsl:text>
                    <xsl:value-of select="productImage"/>
                    <xsl:text>');</xsl:text>
                </xsl:attribute>
            </img>
            <span class="name-product" style="width: 200px">
                <xsl:value-of select="productName"/>
            </span>
            <div class="clear"></div>
            <span class="price-product">
                <xsl:value-of select="productPrice"/> $
            </span>
            <div class="clear"></div>
            <a class="btn-addtocart">Add to cart
            
            </a>
            <div class="btnAddtocart">
                <xsl:element name="input">
                    <xsl:attribute name="value">
                        <xsl:text>Add to Cart</xsl:text>
                    </xsl:attribute>
                    <xsl:attribute name="type">
                        <xsl:text>button</xsl:text>
                    </xsl:attribute>
                    <xsl:attribute name="onclick">
                        <xsl:text>addToCart(</xsl:text>
                        <xsl:value-of select="productID"/>
                        <xsl:text>,'</xsl:text>
                        <xsl:value-of select="productName"/>
                        <xsl:text>',</xsl:text>
                        <xsl:value-of select="productPrice"/>
                        <xsl:text>,1,'</xsl:text>
                        <xsl:value-of select="productImage"/>
                        <xsl:text>')</xsl:text>
                    </xsl:attribute>
                    <xsl:attribute name="class">
                        <xsl:text>buttonAddToCart</xsl:text>
                    </xsl:attribute>
                </xsl:element>
            </div>
        </div>End box-product
    </xsl:template>
</xsl:stylesheet>-->
